<template>
  <div class="wrapper">
    <ul class="content">
      <li>fenlei1</li>
      <li>fenlei2</li>
      <li>fenlei3</li>
      <li>fenlei4</li>
      <li>fenlei5</li>
      <li>fenlei6</li>
      <li>fenlei7</li>
      <li>fenlei8</li>
      <li>fenlei9</li>
      <li>fenlei10</li>
      <li>fenlei11</li>
      <li>fenlei12</li>
      <li>fenlei13</li>
      <li>fenlei14</li>
      <li>fenlei15</li>
      <li>fenlei16</li>
      <li>fenlei17</li>
      <li>fenlei18</li>
      <li>fenlei19</li>
      <li>fenlei20</li>
      <li>fenlei21</li>
      <li>fenlei22</li>
      <li>fenlei23</li>
      <li>fenlei24</li>
      <li>fenlei25</li>
      <li>fenlei26</li>
      <li>fenlei27</li>
      <li>fenlei28</li>
      <li>fenlei29</li>
      <li>fenlei30</li>
      <li>fenlei26</li>
      <li>fenlei27</li>
      <li>fenlei28</li>
      <li>fenlei29</li>
      <li>fenlei30</li>
      <li>fenlei26</li>
      <li>fenlei27</li>
      <li>fenlei28</li>
      <li>fenlei29</li>
      <li>fenlei30</li>
      <li>fenlei26</li>
      <li>fenlei27</li>
      <li>fenlei28</li>
      <li>fenlei29</li>
      <li>fenlei30</li>
      <li>fenlei26</li>
      <li>fenlei27</li>
      <li>fenlei28</li>
      <li>fenlei29</li>
      <li>fenlei30</li>
      <li>fenlei26</li>
      <li>fenlei27</li>
      <li>fenlei28</li>
      <li>fenlei29</li>
      <li>fenlei30</li>
      <li>fenlei26</li>
      <li>fenlei27</li>
      <li>fenlei28</li>
      <li>fenlei29</li>
      <li>fenlei30</li>
      <li>fenlei26</li>
      <li>fenlei27</li>
      <li>fenlei28</li>
      <li>fenlei29</li>
      <li>fenlei30</li>
    </ul>
  </div>
</template>

<script>
import BScroll from 'better-scroll'

export default {
  name: "Category",
  data () {
    return {
      scroll: null
    }
  },
  mounted () {
    this.scroll = new BScroll(document.querySelector('.wrapper'), {
      probeType: 3,
      pullUpLoad: true
    })
    this.scroll.on('scroll', (position) => {
      console.log(position);
    })
    this.scroll.on('pullingUp', () => {
      console.log('上拉加载更多');
    })

  },
  methods: {
    btnClick () {
      console.log('btn')
    }
  },
}
</script>

<style scoped>
.wrapper {
  height: 150px;
  background-color: blue;
  /* overflow: hidden; */
  /* overflow-y: scroll; */
}
</style>
